<template>
  <Card title="教育经历" @add="handleAdd()">
    <EI v-for="item in seekerStore.education_experiences" :data="item" @edit="handleEdit"></EI>
  </Card>

  <MeModal ref="editEERef" width="600px" @ok="handleEditSave()">
    <n-form ref="EEFormRef" :model="form" :rules="rules">
      <n-grid :cols="24" :x-gap="24">
        <n-form-item-gi label="学校名称" path="school_name" :span="12">
          <n-input v-model:value="form.school_name" maxlength="20" />
        </n-form-item-gi>
        <n-form-item-gi label="专业名称" path="major_name" :span="12">
          <n-input v-model:value="form.major_name" maxlength="10" />
        </n-form-item-gi>
        <n-form-item-gi label="学历" path="degree" :span="12">
          <n-select v-model:value="form.degree" :options="degreeOps" />
        </n-form-item-gi>
        <n-form-item-gi label="时间" path="time" :span="12">
          <n-date-picker
            v-model:formatted-value="form.time"
            type="monthrange"
            value-format="yyyy-MM-dd HH:mm:ss"
          />
        </n-form-item-gi>
      </n-grid>
    </n-form>
  </MeModal>
</template>

<script setup>
import seekerApi from '@/api/seeker'
import { MeModal } from '@/components'
import { useSeekerStore } from '@/store'
import { useForm, useModal } from '@/composables'
import Card from '../card.vue'
import EI from './educationExperienceItem.vue'
const seekerStore = useSeekerStore()
seekerStore.getEducationExperience()

const rules = {
  school_name: { required: true, message: '此为必填项', trigger: ['blur', 'change'] },
  major_name: { required: true, message: '此为必填项', trigger: ['blur', 'change'] },
  degree: {
    type: 'number',
    required: true,
    message: '此为必填项',
    trigger: ['blur'],
  },
  time: {
    type: 'array',
    required: true,
    message: '此为必填项',
    trigger: ['blur'],
  },
}

const degreeOps = [
  { value: 0, label: '中专/中技' },
  { value: 1, label: '大专' },
  { value: 2, label: '本科' },
  { value: 3, label: '硕士' },
  { value: 4, label: 'MBA/EMBA' },
  { value: 5, label: '博士' },
]

const [editEERef] = useModal()
const [EEFormRef, form, EEValidation] = useForm({})

function handleEdit(id) {
  const value = form.value
  const ee = seekerStore.education_experiences.find((o) => o.id === id)
  value.id = id
  value.time = [ee.start_time, ee.end_time]
  value.degree = ee.degree
  value.school_name = ee.school_name
  value.major_name = ee.major_name
  editEERef.value.open({ title: '编辑教育经历信息' })
}

function handleAdd() {
  const value = form.value
  value.id = null
  value.time = null
  value.degree = null
  value.school_name = null
  value.major_name = null
  editEERef.value.open({ title: '添加教育经历信息', okText: '添加' })
}

async function handleEditSave() {
  await EEValidation()
  form.value.seeker_id = seekerStore.seeker.seeker_id
  form.value.start_time = form.value.time[0]
  form.value.end_time = form.value.time[1]
  await seekerApi.saveEducationExperience(form.value)
  $message.success('保存成功')
  seekerStore.getEducationExperience()
}
</script>
